<template>
  <!-- 主页面框架 -->
  <ALayout class="frame">
    <ALayoutHeader class="header">
      <vy-theme-header :tag="3" :projectid="projectId"></vy-theme-header>
    </ALayoutHeader>
    <ALayout class="center">
      <ALayoutSider class="sleft" width="20%">
        <a-menu mode="vertical" v-model="leftkey">
          <a-menu-item key="cs_project">项目信息</a-menu-item>
          <a-menu-item key="cs_notice">提醒设置</a-menu-item>
          <a-menu-item key="cs_score">积分规则</a-menu-item>
          <a-menu-item key="cs_join_setting">申请加入设置</a-menu-item>
          <!-- <a-menu-item key="cs_certmgr">证书管理</a-menu-item> -->
        </a-menu>
      </ALayoutSider>
      <ALayoutContent class="content">
        <vy-cmp-center :flag="leftkey[0]"></vy-cmp-center>
      </ALayoutContent>
    </ALayout>
  </ALayout>
</template>

<script>
import VyHeader from "../../../components/theme-header.vue";
import VyCenter from "./frame/center.vue";
export default {
  data() {
    return {
      leftkey: ["cs_project"], // 默认为项目信息
      projectId: ""
    };
  },
  created() {
    this.projectId = this.$route.query.projectId;
  },
  components: {
    [VyHeader.name]: VyHeader,
    [VyCenter.name]: VyCenter
  },
  methods: {}
};
</script>

<style type="text/css" lang="scss" scoped>
.ant-layout {
  height: 100%;
  .ant-layout-header {
    padding: 0;
    background: #ffffff;
    -webkit-box-shadow: -8px -1px 30px 0px rgba(25, 63, 100, 0.15);
    box-shadow: -8px -1px 30px 0px rgba(25, 63, 100, 0.15);
    z-index: 9;
  }
  .ant-layout-sider {
    background: #ffffff;
  }
}
.sleft {
  padding: 30px 20px;
  box-shadow: -8px -1px 30px 0px rgba(25, 63, 100, 0.15);
  .ant-menu {
    // padding: 10px 20px;
    border: none;
    .ant-menu {
      font-weight: 400;
      color: rgba(103, 103, 103, 1);
    }
    .ant-menu-item-selected {
      font-weight: 600;
      color: rgba(0, 0, 0, 1);
      background-color: transparent;
      &::after {
        border: 6px solid #000000;
        border-color: transparent transparent transparent #000000;
        opacity: 1;
        top: 50%;
        bottom: unset;
        transform: translate(-50%, -50%);
      }
    }
  }
}
.content {
  box-shadow: -8px -1px 30px 0px rgba(25, 63, 100, 0.15);
  padding: 0 0 0 20px;
}
</style>
